<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title><?php echo $title;?></title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="../../public/plugin/layui/css/layui.css" media="all">
  <script src="../../public/js/jquery.js"></script>
</head>
<body>

  <div class="layui-fluid">
    <div class="layui-row layui-col-space15">
      <div class="layui-col-md12">
        <div class="layui-card">
          <div class="layui-card-header" style="padding-top:30px;"><?php echo $title;?></div>
          <div class="layui-card-body" pad15>
            <form action="" class="layui-form">		
			
              <div class="layui-form-item">
				<label class="layui-form-label">用户名</label>
				<div class="layui-input-inline">
                  <input type="text" name="name" id="reg-username"  lay-verify="required|name" placeholder="请输入用户名"  class="layui-input">
                </div>
				<div class="layui-form-mid layui-word-aux">4到18个字符</div>
              </div>
              
			  <div class="layui-form-item">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-inline">
                  <input type="password" name="password" lay-verify="required|password" id="reg-password" placeholder="请输入密码"  class="layui-input">
                </div>
				<div class="layui-form-mid layui-word-aux">由4-18个字符组成！</div>
              </div>
			  
			  <div class="layui-form-item">
                <label class="layui-form-label">确认密码</label>
                <div class="layui-input-inline">
                  <input type="password" name="repassword" lay-verify="required|repassword" id="confirm-password" placeholder="请再次输入密码"  class="layui-input">
                </div>
				<div class="layui-form-mid layui-word-aux">两次密码必须一致</div>
              </div>
			  
              <div class="layui-form-item">
                <div class="layui-input-block">
                  <button class="layui-btn" lay-submit="" lay-filter="submit_button">添加</button>
                  <button type="reset" id="reset" class="layui-btn layui-btn-primary">重新填写</button>
                </div>
              </div>
            
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
</html>
<script src="../../public/plugin/layui/layui.js"></script>
<script>
layui.use('form', function(){
  var form = layui.form,
	layer = layui.layer;
  
  //自定义验证规则
  form.verify({
    name: function(value,item){
       //value：表单的值、item：表单的DOM对象
        if (!new RegExp("^(.+){4,18}$").test(value)) {
            return '用户名长度必须为4-18位'
        }
        if (!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)) {
            return '用户名不能有特殊字符';
        }
        if (/(^\_)|(\__)|(\_+$)/.test(value)) {
            return '用户名首尾不能出现下划线\'_\'';
        }
        if (/^\d+\d+\d$/.test(value)) {
            return '用户名不能全为数字';
        }
    }
    ,password: [
      /^[\S]{4,18}$/
      ,'密码必须4到18位，且不能出现空格'
    ]
    ,repassword: function(value,item){
		if (!new RegExp("^[\\S]{4,18}$").test(value)) {
            return '密码长度必须为4-18位'
        }
		if($('#confirm-password').val() != $("#reg-password").val()){
			return '两次密码不一致';
		}
    }
  });
  
  //监听提交
  form.on('submit(submit_button)', function(data){
    /*layer.alert(JSON.stringify(data.field), {
      
    });*/
	var name = $("#reg-username").val();
	var password = $("#reg-password").val();
	$.ajax({
                url: "ajaxAddAdmin.php",
                type: "POST",
                data: {
                    name: name,
                    password: password,
                    csrfmiddlewaretoken: '{{ csrf_token  }}'
                },
                async: false,
				dataType:'json',
                success: function (data) {
                    if (data.status === 1) {
                        layer.msg(data.message, {icon: 1,time:2000});
						$("#reg-username").val("");
                        $("#reg-username").focus();
						$("#reg-password").val("");
						$("#confirm-password").val("");
                    }else if (data.status === 2) {
                        layer.msg(data.message, {icon: 2,time:2000});
						$("#reg-username").val("");
                        $("#reg-username").focus();
                    }else {
                        layer.msg(data.message, {icon: 2,time:2000});
                        $("#reg-username").val("");
                        $("#reg-username").focus();
                    } 
					//layer.msg(data.message);
                },
                error: function () {
                    layer.msg("用户名已存在", {icon: 0,time:2000});
                }
            });
	
    return false;
  });
			  
});
</script>
<script>
/***清空表单****/
	$(function(){
		$("#reset").click(function(){
			$("input").val("");
		});
	});
	
</script>